<!DOCTYPE html>
<html>
<head>
<meta charset="utf-8">
<title>模拟刷卡页面</title>
<meta name="renderer" content="webkit">
<meta http-equiv="X-UA-Compatible" content="IE=edge,chrome=1">
<meta name="viewport"
	content="width=device-width, initial-scale=1, maximum-scale=1">
<meta name="apple-mobile-web-app-status-bar-style" content="black">
<meta name="apple-mobile-web-app-capable" content="yes">
<meta name="format-detection" content="telephone=no">
<link href="layui/css/layui.css" rel="stylesheet" type="text/css" />
<script src="layui/layui.js"></script>
</head>
<body>

	<!-- 查询表单 -->
	<form class="layui-form" onsubmit="return false">
		<div class="layui-form-item">
			<label class="layui-form-label">输入框</label>
			<div class="layui-input-inline">
				<input type="text" name="id" required lay-verify="required"
					placeholder="请输入用户编号" autocomplete="off" class="layui-input">
			</div>
		</div>
		<div class="layui-form-item">
			<label class="layui-form-label">单选框</label>
			<div class="layui-input-block">
				<input type="radio" name="type" value="0" title="学生" checked>
				<input type="radio" name="type" value="1" title="教师">
			</div>
		</div>
		<div class="layui-form-item">
			<div class="layui-input-block">
				<button class="layui-btn" lay-submit lay-filter="formDemo">查询</button>
				<button type="reset" class="layui-btn layui-btn-primary">重置</button>
			</div>
		</div>
	</form>

	<!-- 添加的弹窗学生页面 -->
	<div id="tianjiachuangs" style="display: none">
		<form class="layui-form" onsubmit="return false" id="tianjiaForms"
			lay-filter="tianjiaForms">
			<!-- 提示：如果你不想用form，你可以换成div等任何一个普通元素 -->
			<div class="layui-form-item">
				<label class="layui-form-label">学生卡号</label>
				<div class="layui-input-inline">
					<input type="text" name="scardNo" placeholder="请输入"
						autocomplete="off" class="layui-input">
				</div>
			</div>
			<div class="layui-form-item">
				<label class="layui-form-label">学号</label>
				<div class="layui-input-inline">
					<input type="text" name="stuNo" placeholder="请输入"
						autocomplete="off" class="layui-input">
				</div>
			</div>
			<div class="layui-form-item">
				<label class="layui-form-label">姓名</label>
				<div class="layui-input-inline">
					<input type="text" name="stuname" placeholder="请输入"
						autocomplete="off" class="layui-input">
				</div>
			</div>
			<div class="layui-form-item">
				<label class="layui-form-label">性别</label>
				<div class="layui-input-inline">
					<input type="radio" name="ssex" value="男" title="男" checked>
					<input type="radio" name="ssex" value="女" title="女">
				</div>
			</div>
			<div class="layui-form-item">
				<label class="layui-form-label">院系编号</label>
				<div class="layui-input-inline">
					<input type="text" name="memberShipId" placeholder="请输入"
						autocomplete="off" class="layui-input">
				</div>
			</div>
		<!-- 	<div class="layui-form-item">
				<label class="layui-form-label">资源</label>
				<div class="layui-input-inline">
					<input type="text" name="sreadRoomId" placeholder="请输入"
						autocomplete="off" class="layui-input">
				</div>
			</div> -->
			
			<div class="layui-form-item">
				<label class="layui-form-label">资源</label>
				<div class="layui-input-inline">
					<select name="sreadRoomId" id="sreadRoomId" lay-filter="sreadRoomId">
						<option value=""></option>
						<option value=""></option>
					</select>
				</div>
			</div>
			<div class="layui-form-item">
				<label class="layui-form-label">状态</label>
				<div class="layui-input-inline">
					<input type="text" name="status" placeholder="请输入"
						autocomplete="off" class="layui-input">
				</div>
			</div>
			<div class="layui-form-item">
			<label class="layui-form-label"></label>
				<div class="layui-input-block">
					<button class="layui-btn" lay-submit lay-filter="tianjiabtns">刷卡</button>
					<button type="reset" class="layui-btn layui-btn-primary">重置</button>
				</div>
			</div>
			<input type="hidden" id="stuid" name="stuid" />
		</form>
	</div>



	<!-- 添加的弹窗教师页面 -->
	<div id="tianjiachuangt" style="display: none">
		<form class="layui-form" onsubmit="return false" id="tianjiaFormt"
			lay-filter="tianjiaFormt">
			<!-- 提示：如果你不想用form，你可以换成div等任何一个普通元素 -->
			<div class="layui-form-item">
				<label class="layui-form-label">教师卡号</label>
				<div class="layui-input-inline">
					<input type="text" name="tcardNo" placeholder="请输入"
						autocomplete="off" class="layui-input">
				</div>
			</div>
			<div class="layui-form-item">
				<label class="layui-form-label">姓名</label>
				<div class="layui-input-inline">
					<input type="text" name="tname" placeholder="请输入"
						autocomplete="off" class="layui-input">
				</div>
			</div>
			<div class="layui-form-item">
				<label class="layui-form-label">性别</label>
				<div class="layui-input-inline">
					<input type="radio" name="tsex" value="男" title="男" checked>
					<input type="radio" name="tsex" value="女" title="女">
				</div>
			</div>
			<div class="layui-form-item">
				<label class="layui-form-label">科室编号</label>
				<div class="layui-input-inline">
					<input type="text" name="sectionId" placeholder="请输入"
						autocomplete="off" class="layui-input">
				</div>
			</div>
			<!-- <div class="layui-form-item">
				<label class="layui-form-label">资源</label>
				<div class="layui-input-inline">
					<input type="text" name="treadRoomId" placeholder="请输入"
						autocomplete="off" class="layui-input">
				</div>
			</div> -->
			<div class="layui-form-item">
				<label class="layui-form-label">资源</label>
				<div class="layui-input-inline">
					<select name="treadRoomId" id="treadRoomId"lay-filter="treadRoomId">
						<option value=""></option>
						<option value=""></option>
					</select>
				</div>
			</div>
			<div class="layui-form-item">
				<label class="layui-form-label">状态</label>
				<div class="layui-input-inline">
					<input type="text" name="status" placeholder="请输入"
						autocomplete="off" class="layui-input">
				</div>
			</div>

			<div class="layui-form-item">
			<label class="layui-form-label"></label>
				<div class="layui-input-block">
					<button class="layui-btn" lay-submit lay-filter="tianjiabtnt">刷卡</button>
					<button type="reset" class="layui-btn layui-btn-primary">重置</button>
				</div>
			</div>
			<input type="hidden" id="tid" name="tid" />
		</form>
	</div>



	<script>
		//Demo
		layui.use('form', function() {
			var form = layui.form;
			var $ = layui.$;

			//监听提交
			form.on('submit(formDemo)', function(data) {
				//layer.msg(JSON.stringify(data.field));

				$.post("getInfoById", data.field, function(res) {
					console.log(res.data);
					if (res.code == 0) {
						console.log($("input[name='type']:checked").val())
						if ($("input[name='type']:checked").val() == 0) {
							if (res.data) {
								form.val("tianjiaForms", res.data);
								//弹窗
								layer.open({
									type : 1,
									area : [ '800px', '600px' ],
									shadeClose : true,
									content : $('#tianjiachuangs')
								});
							}
						} else if ($("input[name='type']:checked").val() == 1) {
							if (res.data) {
								form.val("tianjiaFormt", res.data);
								//弹窗
								layer.open({
									type : 1,
									area : [ '800px', '600px' ],
									shadeClose : true,
									content : $('#tianjiachuangt')
								});
							}
						}
					} else {
						layer.alert("你查询的用户不存在");
					}
				}, "json");

			});

			//添加提交的 监听
			form.on('submit(tianjiabtns)', function(data) {
				console.log($("input[name='scardNo']").val());
				console.log($("#sreadRoomId").val())
				$.post("addLog", {
					uid : $("input[name='scardNo']").val(),
					rid : $("#sreadRoomId").val()
				}, function(res) {
					if (res.code != 1) {
						layer.alert("添加成功", function() {
							layer.closeAll(); //关闭所有的窗口
							window.location.href = "dailylog.html";
						});
					} else {
						layer.alert(res.msg, function() {
							layer.closeAll(); //关闭所有的窗口
						});
					}
				}, "json");

				return false; //阻止表单跳转。如果需要表单跳转，去掉这段即可。
			});
			//添加提交的 监听---end

			//添加提交的 监听
			form.on('submit(tianjiabtnt)', function(data) {
				
				$.post("addLog", {
					uid : $("input[name='tcardNo']").val(),
					rid : $("#treadRoomId").val()
				}, function(res) {
					if (res.code != 1) {
						layer.alert("添加成功",function(){
							layer.closeAll(); //关闭所有的窗口
							window.location.href = "dailylog.html";
						});
					} else {
						layer.alert(res.msg, function() {
							layer.closeAll(); //关闭所有的窗口
						});
					}
				}, "json");

				return false; //阻止表单跳转。如果需要表单跳转，去掉这段即可。
			});
			//添加提交的 监听---end

			//html异步请求获取关联的外键表并渲染
			$.post("getReadList",function(res){
					if(res.data){
						console.log(res.data);
						$("[name=sreadRoomId]").empty();//清空下拉框
		                $("[name=sreadRoomId]").append("<option value=''>--请选择--</option>");
		                for(var i=0;i<res.data.length;i++){
		                    var item=res.data[i];
		                    $("[name=sreadRoomId]").append("<option value="+item.rid+">"+item.rname+"</option>");
		                }
		                //重新渲染select
		                form.render('select');
					}
				})
				
			//html异步请求获取关联的外键表并渲染
			$.post("getReadList",function(res){
					if(res.data){
						$("[name=treadRoomId]").empty();//清空下拉框
		                $("[name=treadRoomId]").append("<option value=''>--请选择--</option>");
		                for(var i=0;i<res.data.length;i++){
		                    var item=res.data[i];
		                    $("[name=treadRoomId]").append("<option value="+item.rid+">"+item.rname+"</option>");
		                }
		                //重新渲染select
		                form.render('select');
					}
				})	
				
		});
	</script>
</body>
</html>